<div class="tab-pane" id="tab-tables" role="tabpanel" aria-labelledby="nav-tables">
	<div class="card">
		<div class="card-header">
			<div class="row align-items-center">
				<div class="col">
					<div class="h4 mb-0"><i class="bi bi-box-seam me-2"></i>Tables</div>
				</div>
				<div class="col-auto">
					<a href="https://gitbrent.github.io/PptxGenJS/docs/api-tables/" title="Documentation" target="_blank">
						Docs<i class="bi bi-box-arrow-up-right ms-2"></i>
					</a>
				</div>
			</div>
		</div>
		<div class="card-body lg-bm">
			<div class="row row-cols-auto row-cols-md-3 gx-4 gy-5">
				<div class="col">
					<h5>Table Layout/Format</h5>
					<h6>Slide 1</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">text alignment</li>
						<li class="list-group-item">cell styles</li>
						<li class="list-group-item">row height</li>
						<li class="list-group-item">col width</li>
					</ul>
					<h6>Slide 2</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">colspans and rowspans</li>
					</ul>
					<h6>Slide 3</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">extreme colspans and rowspans</li>
					</ul>
				</div>
				<div class="col">
					<h5>Cell Formatting</h5>
					<h6>Slide 4</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">cell margins</li>
						<li class="list-group-item">complex cell borders</li>
						<li class="list-group-item">escaped special characters</li>
					</ul>
					<h6>Slide 5</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">cell text formatting overview</li>
					</ul>
					<h6>Slide 6</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">cell text formatting examples</li>
					</ul>
				</div>
				<div class="col">
					<h5>Auto-Paging Examples</h5>
					<h6>Slides 7-8</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">basic auto-paging example</li>
					</ul>
					<h6>Slides 9-12</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">paging with small table dimensions</li>
					</ul>
					<h6>Slides 13-15</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">auto-paging with a Master Page</li>
					</ul>
					<h6>Slide 16</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">auto-paging disabled <code>{autoPage:false}</code></li>
					</ul>
				</div>
				<div class="col">
					<h5>Auto-Paging Props</h5>
					<h6>Slides 17-19</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">start at <code>{y:4.0}</code>, subsequent start at top margin</li>
					</ul>
					<h6>Slides 20-22</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">start at <code>{y:4.0}</code>, subsequent start at <code>{autoPageSlideStartY:1.5}</code></li>
					</ul>
				</div>
				<div class="col">
					<h5>Auto-Paging Props</h5>
					<h6>Slides 23-24</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">various <code>autoPageRepeatHeader</code> thead configs</li>
					</ul>
					<h6>Slides 25-28</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">various <code>autoPageLineWeight</code> values</li>
					</ul>
					<h6>Slides 29-32</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">various <code>autoPageCharWeight</code> values</li>
					</ul>
				</div>
				<div class="col">
					<h5>Auto-Paging Complex Cell Text</h5>
					<h6>Slides 33-35</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">complex cell text</li>
					</ul>
					<h6>Slides 36-39</h6>
					<ul class="list-group list-group-flush">
						<li class="list-group-item">complex cell text with calculated lines</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="card-footer text-center">
			<button id="btnGenFunc_Table" type="button" class="btn btn-success px-5">Run Demo</button>
		</div>
	</div>
</div>
